<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>LvFeng technology Blog</title>
    <link rel="stylesheet" href="../file/css/bootstrap.min.css">                                      <!-- Bootstrap style -->
    <link rel="stylesheet" href="../file/css/templatemo-style.css">                                   <!-- Templatemo style -->

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
          <![endif]-->
    <style type="text/css">
        .tm-home-img-container{
            width: 100%;
            height: 400px;
            background-image: url('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1533716146630&di=776073afaaf130483a43947f965a8f68&imgtype=0&src=http%3A%2F%2Fwww.luculent.net%2Fen%2Fupload%2F2017%2F03%2F15%2F14895607161717der49.jpg');
        }
    </style>
</head>

    <body>
       
        <div class="tm-header">
            <div class="container-fluid">
                <div class="tm-header-inner">
                    <a href="../blog_index.html" class="navbar-brand tm-site-name">绿绿峰</a>
                    
                    <!-- navbar -->
                    <nav class="navbar tm-main-nav">

                        <button class="navbar-toggler hidden-md-up" type="button" data-toggle="collapse" data-target="#tmNavbar">
                            &#9776;
                        </button>
                        
                        <div class="collapse navbar-toggleable-sm" id="tmNavbar">
                            <ul class="nav navbar-nav">
                                <li class="nav-item active">
                                    <a href="#" class="nav-link">【技术】</a>
                                </li>
                                <li class="nav-item">
                                    <a href="../life/li_blog_index.html" class="nav-link">生活</a>
                                </li>
                                <li class="nav-item">
                                    <a href="../hobby/ho_blog_index.html" class="nav-link">爱好</a>
                                </li>
                                <li class="nav-item">
                                    <a href="../talk/ta_blog_index.html" class="nav-link">杂谈</a>
                                </li>
                            </ul>                        
                        </div>
                        
                    </nav>  

                </div>                                  
            </div>            
        </div>

        <div class="tm-home-img-container">
            <!-- <img src="file/image/bg.jpg" alt="Image" class="hidden-lg-up img-fluid"> -->
        </div>

        <section class="tm-section">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-xs-center">
                        <h2 class="tm-gold-text tm-title">Technology——技术</h2>
                        <p class="tm-subtitle">一些小技术~知乎而后分享！</p>
                    </div>
                </div>  <hr>
                <div class="row">
                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">

                        <div class="tm-content-box">
                            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1533740798631&di=0eeac759e43045bf09312957e888b439&imgtype=0&src=http%3A%2F%2Fd.hiphotos.baidu.com%2Fzhidao%2Fpic%2Fitem%2F1ad5ad6eddc451da02496daeb7fd5266d0163233.jpg" alt="Image" class="tm-margin-b-20 img-fluid">
                            <h4 class="tm-margin-b-20 tm-gold-text">代码高亮！</h4>
                            <p class="tm-margin-b-20">插入在网页中的代码高亮插件</p>
                            <a href="te_blog_1.html" class="tm-btn text-uppercase">点击详情</a>    
                        </div>  

                    </div>

                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">

                        <div class="tm-content-box">
                            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1533741511745&di=8c6931db1be7c646c659cc35b8557260&imgtype=0&src=http%3A%2F%2Fp7.qhimg.com%2Ft01257bd644c21ffa2d.png" alt="Image" class="tm-margin-b-20 img-fluid">
                            <h4 class="tm-margin-b-20 tm-gold-text">MySQL疑难</h4>
                            <p class="tm-margin-b-20">整理一下MySQL遇到过的麻烦事儿</p>
                            <a href="te_blog_2.html" class="tm-btn text-uppercase">点击详情</a>    
                        </div>  

                    </div>

                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">

                        <div class="tm-content-box">
                            <img src="../file/image/tm-img-310x180-3.jpg" alt="Image" class="tm-margin-b-20 img-fluid">
                            <h4 class="tm-margin-b-20 tm-gold-text">Chrome新体验</h4>
                            <p class="tm-margin-b-20">新的~</p>
                            <a href="te_blog_3.html" class="tm-btn text-uppercase">点击详情</a>    
                        </div>  

                    </div>

                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">

                        <div class="tm-content-box">
                            <img src="../file/image/tm-img-310x180-4.jpg" alt="Image" class="tm-margin-b-20 img-fluid">
                            <h4 class="tm-margin-b-20 tm-gold-text">文章 #4</h4>
                            <p class="tm-margin-b-20">夕阳</p>
                            <a href="#" class="tm-btn text-uppercase">点击详情</a>    
                        </div>  

                    </div>
                </div> <!-- row -->

                <div class="row tm-margin-t-big">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6">
                        <div class="tm-2-col-left">
                            
                            <h3 class="tm-gold-text tm-title">轻松一下吧</h3>
                            <p class="tm-margin-b-30">看点右侧‘有声有色’的~</p>
                            <img src="../file/image/tm-img-660x330-1.jpg" alt="Image" class="tm-margin-b-40 img-fluid">
                            <p>
                                文章从这里开始
                            </p>
                            <p>时光如流水</p>
                            <p class="m-b-2"> 纪念我们逝去的
                            </p>
                            <a href="https://www.jianshu.com/" target="_blank" class="tm-btn text-uppercase">简书</a>

                        </div>
                    </div>
                    
                    

                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6">

                        <div class="tm-2-col-right">

                            <div class="tm-2-rows-md-swap">
                                <div class="tm-overflow-auto row tm-2-rows-md-down-2">
                                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-xl-6">
                                        <h3 class="tm-gold-text tm-title">
                                            图片网站精选
                                        </h3>
                                        <nav>
                                            <ul class="nav">
                                                <li><a href="http://www.nipic.com/" target="_blank" class="tm-text-link">昵图网</a></li>
                                                <li><a href="https://www.vcg.com/" target="_blank" class="tm-text-link">视觉中国</a></li>
                                                <li><a href="http://www.lanrentuku.com/" target="_blank" class="tm-text-link">懒人图库</a></li>
                                                <li><a href="https://pixabay.com/" target="_blank" class="tm-text-link">Pixabay</a></li>
                                                <li><a href="https://www.duitang.com/" target="_blank" class="tm-text-link">堆糖网</a></li>
                                            </ul>
                                        </nav>    
                                    </div> <!-- col -->

                                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-xl-6 tm-xs-m-t">
                                        <h3 class="tm-gold-text tm-title">
                                            还有一些音乐
                                        </h3>
                                        <nav>
                                            <ul class="nav">
                                                <li><a href="https://music.163.com/" target="_blank" class="tm-text-link">网易音乐</a></li>
                                                <li><a href="https://y.qq.com/" target="_blank" class="tm-text-link">QQ音乐</a></li>
                                                <li><a href="https://www.xiami.com/" target="_blank" class="tm-text-link">虾米音乐</a></li>
                                                <li><a href="http://www.qingting.fm/" target="_blank" class="tm-text-link">蜻蜓FM</a></li>
                                                <li><a href="http://www.kugou.com/" target="_blank" class="tm-text-link">酷狗</a></li>
                                            </ul>
                                        </nav>    
                                    </div> <!-- col -->
                                </div>                        
                                
                                <div class="row tm-2-rows-md-down-1 tm-margin-t-mid">
                                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
                                        <h3 class="tm-gold-text tm-title tm-margin-b-30">小展板</h3>
                                        <div class="media tm-related-post">
                                          <div class="media-left media-middle">
                                            <a href="#">
                                              <img class="media-object" src="../file/image/tm-img-240x120-1.jpg" alt="Generic placeholder image">
                                            </a>
                                          </div>
                                          <div class="media-body">
                                            <a href="#"><h4 class="media-heading tm-gold-text tm-margin-b-15">竞技者</h4></a>
                                            <p class="tm-small-font tm-media-description">追逐</p>
                                          </div>
                                        </div>
                                        <div class="media tm-related-post">
                                          <div class="media-left media-middle">
                                            <a href="#">
                                              <img class="media-object" src="../file/image/tm-img-240x120-2.jpg" alt="Generic placeholder image">
                                            </a>
                                          </div>
                                          <div class="media-body">
                                            <a href="#"><h4 class="media-heading tm-gold-text tm-margin-b-15">城市</h4></a>
                                            <p class="tm-small-font tm-media-description">寥寥无几</p>
                                          </div>
                                        </div>
                                        <div class="media tm-related-post">
                                          <div class="media-left media-middle">
                                            <a href="#">
                                              <img class="media-object" src="../file/image/tm-img-240x120-3.jpg" alt="Generic placeholder image">
                                            </a>
                                          </div>
                                          <div class="media-body">
                                            <a href="#"><h4 class="media-heading tm-gold-text tm-margin-b-15">一扇门</h4></a>
                                            <p class="tm-small-font tm-media-description">通向未知</p>
                                          </div>
                                        </div>
                                    </div>
                                </div>    
                            </div>

                        </div>
                        
                    </div>
                </div> <!-- row -->

            </div>
        </section>
        
        <footer class="tm-footer">
            <div class="container-fluid">
                <div class="row">
                    
                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">
                        
                        <div class="tm-footer-content-box">
                            <h3 class="tm-gold-text tm-title tm-footer-content-box-title">技术控</h3>
                            <div class="tm-gray-bg">
                                <p>聚沙成塔</p>
                                <p>就会堆个金字塔咯！</p>
                                <p><strong>LvLvFeng</strong></p>    
                            </div>    
                        </div>
                                                
                    </div>

                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">
                        <div class="tm-footer-content-box tm-footer-links-container">
                        
                            <h3 class="tm-gold-text tm-title tm-footer-content-box-title">开放平台</h3>
                            <nav>
                                <ul class="nav">
                                    <li><a href="https://cloud.baidu.com" target="_blank" class="tm-footer-link">百度云人工智能</a></li>
                                    <li><a href="https://www.aliyun.com/" target="_blank" class="tm-footer-link">阿里云开放平台</a></li>
                                    <li><a href="https://cloud.tencent.com/" target="_blank" class="tm-footer-link">腾讯云开放平台</a></li>
                                    <li><a href="http://fanyi.baidu.com/" target="_blank" class="tm-footer-link">不会英语？百度翻译！</a></li>
                                </ul>
                            </nav>

                        </div>
                        
                    </div>

                    <!-- Add the extra clearfix for only the required viewport 
                        http://stackoverflow.com/questions/24590222/bootstrap-3-grid-with-different-height-in-each-item-is-it-solvable-using-only
                    -->
                    <div class="clearfix hidden-lg-up"></div>

                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">

                        <div class="tm-footer-content-box">
                        
                            <h3 class="tm-gold-text tm-title tm-footer-content-box-title">数据网站</h3>
                            <p class="tm-margin-b-30"><a href="https://www.juhe.cn/" target="_blank">聚合数据接口</a></p>
                            <p class="tm-margin-b-30"><a href="https://www.nowapi.com/api" target="_blank">NowAPI数据</a></p><!-- <hr class="tm-margin-b-30"> -->
                            <p class="tm-margin-b-30"><a href="https://www.seniverse.com/" target="_blank">心知天气</a></p>
                            <a href="http://tool.oschina.net/" target="_blank" class="tm-btn tm-btn-gray text-uppercase">在线工具网</a>

                        </div>
                        
                    </div>

                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 col-xl-3">

                        <div class="tm-footer-content-box">
                        
                            <h3 class="tm-gold-text tm-title tm-footer-content-box-title">Ku站点</h3>
                            <!-- <div class="tm-margin-b-30">
                                <img src="../file/image/tm-img-100x100-1.jpg" alt="Image" class="tm-footer-thumbnail">
                                <img src="../file/image/tm-img-100x100-2.jpg" alt="Image" class="tm-footer-thumbnail">
                                <img src="../file/image/tm-img-100x100-3.jpg" alt="Image" class="tm-footer-thumbnail">
                                <img src="../file/image/tm-img-100x100-4.jpg" alt="Image" class="tm-footer-thumbnail">
                            </div> -->
                            <p class="tm-margin-b-20"><a href="https://www.csdn.net/" target="_blank">CSDN</a></p>
                            <p class="tm-margin-b-20"><a href="https://www.oschina.net/" target="_blank">OSChina</a></p>
                            <p class="tm-margin-b-20"><a href="https://gitee.com/" target="_blank">Gitee码云</a></p>
                            <p class="tm-margin-b-20"><a href="http://36kr.com/" target="_blank">36氪</a></p>
                            <a href="https://www.baidu.com" target="_blank" class="tm-btn tm-btn-gray text-uppercase">百度吧~</a>

                        </div>
                        
                    </div>


                </div>

                <div class="row">
                    <div class="col-xs-12 tm-copyright-col">
                        <p class="tm-copyright-text">Copyright 2018 LvLvFeng.  <a href="#" target="_blank" title="绿绿峰">绿绿峰</a> - from <a href="#" title="地址" target="_blank">辽宁</a></p>
                    </div>
                </div>
            </div>
        </footer>

        <!-- load JS files -->
        <script src="../file/js/jquery.min.js"></script>             <!-- jQuery (https://jquery.com/download/) -->
        <script src="../file/js/tether.min.js"></script> <!-- Tether for Bootstrap, http://stackoverflow.com/questions/34567939/how-to-fix-the-error-error-bootstrap-tooltips-require-tether-http-github-h --> 
        <script src="../file/js/bootstrap.min.js"></script>                 <!-- Bootstrap (http://v4-alpha.getbootstrap.com/) -->
       
</body>
</html>